@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row">
        <div class="col-md-8 col-md-offset-2">
            <div class="panel panel-default">
                <div class="panel-heading">绑定银行卡</div>
                <div class="panel-body">
                    <form class="form-horizontal" role="form" method="POST" action="{{ url('/login') }}">
                        {!! csrf_field() !!}

                        <div class="form-group{{ $errors->has('email') ? ' has-error' : '' }}">
                            <label class="col-md-4 control-label">开户姓名</label>

                            <div class="col-md-6">
                                <input type="text" class="form-control" name="email" value="" >
                            </div>
                        </div>

                        <div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
                            <label class="col-md-4 control-label">身份证号</label>

                            <div class="col-md-6">
                                <input type="text" class="form-control" name="password" value="" >
                            </div>
                        </div>
						<div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
                            <label class="col-md-4 control-label">选择银行</label>

                            <div class="col-md-6">
                                <input id="bankval" type="button" class="form-control" name="password" value="农业银行" data-toggle="modal" data-target="#myModal">
                            </div>
                            
                            <!-- Modal -->
							<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
							  <div class="modal-dialog">
							    <div class="modal-content">
							      <div class="modal-header">
							        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
							        <h4 class="modal-title" id="myModalLabel">银行列表</h4>
							      </div>
							      <div class="modal-body">
							        <ul class="list-group" id="bank">
									  <li class="list-group-item">农业银行</li>
									  <li class="list-group-item">建设银行</li>
									  <li class="list-group-item">工商银行</li>
									  <li class="list-group-item">民生银行</li>
									  <li class="list-group-item">中国银行</li>
									</ul>
							      </div>
							      <div class="modal-footer">
							        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
							      </div>
							    </div>
							  </div>
							</div>
                        </div>
                        <div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
                            <label class="col-md-4 control-label">开户地址</label>

                            <div class="col-md-6">
                            	
                            	<!-- Modal -->
                                <div class="form-group">
								    <div class="bs-chinese-region flat dropdown cashing-region" data-submit-type="id" data-min-level="1" data-max-level="3">
								        <input type="text" class="form-control" name="address" id="address" placeholder="选择你的地区" data-toggle="dropdown" readonly="" value="440103">
								        <div class="dropdown-menu" role="menu" aria-labelledby="dLabel">
								            <div>
								                <ul class="nav nav-tabs" role="tablist">
								                    <li role="presentation" class="active"><a href="#province" data-next="city" role="tab" data-toggle="tab">省份</a></li>
								                    <li role="presentation"><a href="#city" data-next="district" role="tab" data-toggle="tab">城市</a></li>
								                    <li role="presentation"><a href="#district" data-next="street" role="tab" data-toggle="tab">县区</a></li>
								                </ul>
								                <div class="tab-content">
								                    <div role="tabpanel" class="tab-pane active" id="province">--</div>
								                    <div role="tabpanel" class="tab-pane" id="city">--</div>
								                    <div role="tabpanel" class="tab-pane" id="district">--</div>
								                </div>
								            </div>
								        </div>
								    </div>
								</div>
								
                            </div>
                        </div>
                        <div class="form-group{{ $errors->has('password') ? ' has-error' : '' }}">
                            <label class="col-md-4 control-label">银行卡号</label>

                            <div class="col-md-6">
                                <input type="password" class="form-control" name="password">
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-md-6 col-md-offset-4">
                                <div class="checkbox">
                                    <label>
                                        <i class="fa glyphicon glyphicon-hand-right public-marginright10"></i>为了您的资金安全,此账号为您唯一的提现账号,请务必仔细核对以上信息。
                                    </label>
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <div class="col-md-6 col-md-offset-4">
                                <button type="submit" class="btn btn-primary btn-lg btn-block">
                                    <i class="fa glyphicon glyphicon-send public-marginright10"></i>确认信息
                                </button>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-md-6 col-md-offset-4">
                                <button type="button" class="btn btn-default btn-lg btn-block">
                                    <i class="fa glyphicon glyphicon-th public-marginright10"></i>重置信息
                                </button>
                            </div>
                        </div>
                    </form>
                    <script type="text/javascript">
                    	$('#bank').delegate('li','click',function(){
                    		$('#bankval').val($(this).html())
                    		$('#myModal').modal('toggle')
                    	})
                    
                    	$.getJSON("{{ asset('packages/bootstrap-chinese-region/src/sql_areas.json') }}",function(data){
        
					        /**重定义数据结构**/
					        /**
					         * id 键,name 名字,level 层级,parentId 父级
					         */
					        for (var i = 0; i < data.length; i++) {
					            var area = {id:data[i].id,name:data[i].cname,level:data[i].level,parentId:data[i].upid};
					            data[i] = area;
					        }
					
					        $('.bs-chinese-region').chineseRegion('source',data);//导入数据并实例化
					    });
                    </script>

                </div>
            </div>
        </div>
    </div>
</div>
@endsection
